<template>
  <div class="sidebar">
        <div class="title">企业后台管理系统</div>
        <ul>
            <!-- 默认数据 -->
            <!-- <li v-for="(v,i) in lists" :key="i">
                <router-link :to="v.url" >
                    <i class="iconfont" :class="v.icon"></i>
                    <span>{{v.title}}</span>
                </router-link>
            </li> -->
            <!-- 路由公共数据 -->
            <!-- <li v-for="(v,i) in navData" :key="i">
                <router-link :to="v.path" >
                    <i class="iconfont" :class="v.icon"></i>
                    <span>{{v.title}}</span>
                </router-link>
            </li> -->
            <!-- 路由数据动态获取通过store -->
            <li v-for="(v,i) in $store.state.nav" :key="i">
                <router-link :to="v.path" >
                    <i class="iconfont" :class="v.icon"></i>
                    <span>{{v.title}}</span>
                </router-link>
            </li>
        </ul>
    </div>
</template>

<script>
 import navData from '@/utils/navData'  //外部引入
 //import { getNavdata } from '@/utils/http'   //发送请求
export default {
  name: 'Home',
  data(){
      return {
        //   lists:[
        //       {title:'首页',icon:'iconshouye1',url:'/home'},
        //       {title:'企业管理',icon:'iconqiye',url:'/testA'},
        //       {title:'财务管理',icon:'iconcaiwu',url:'/testB'},
        //       {title:'产品管理',icon:'iconchanpin',url:'/testC'},
        //       {title:'订单管理',icon:'iconorder-copy',url:'/testD'},
        //       {title:'管理会员',icon:'iconhuiyuan',url:'/testE'},
        //       {title:'数据概括',icon:'iconshuju',url:'/testF'}
        //   ]
        navData
      }
  },
  methods: {
      getNav(){   //路由中已发送请求，减少请求，直接从store中获取
        // getNavdata().then(res=>{
        //     console.log('1111'+res)
        // })
      }
  },
  mounted(){
      this.getNav();
  }
}
</script>

<style>
.selected {
    background-color: #20343d;
}
</style>